<template>
  <div class="dl_container">
    <div class="dl_left">
      <form action>
        <div class="dl_text">登录</div>
        <el-form :model="key" :rules="logniFormRules" label-width="0px">
          <!-- 用户名 -->
          <el-form-item prop="insAccount">
            <el-input v-model="key.insAccount"></el-input>
          </el-form-item>
          <!-- 密码 -->
          <el-form-item prop="password">
            <el-input v-model="key.insPassword" type="password"></el-input>
          </el-form-item>
          <el-form-item class="btns">
            <el-button type="primary" class="dl_btn" @click="Post_login">登录</el-button>
          </el-form-item>
        </el-form>
      </form>
    </div>
    <div class="dl_right">
      <img src="./assets/img/后台登录.png" alt />
    </div>
  </div>
</template>
<script>
import Cookies from 'js-cookie'
export default {
  data () {
    return {
      Postlogin: [],
      key: {
        insAccount: '',
        insPassword: ''
      },
      logniFormRules: {
        // 验证用户名
        insAccount: [
          { required: true, message: '请输入登录名称', trigger: 'blur' },
          { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
        ],
        // 验证密码
        insPassword: [
          { required: true, message: '请输入登录密码', trigger: 'blur' },
          { min: 6, max: 15, message: '长度在 6 到 15 个字符', trigger: 'blur' }
        ]
      }
    };
  },
  created () {
  },
  methods: {
    async Post_login () {
      let formData = new FormData()
      formData.append('insAccount', this.key.insAccount)
      formData.append('insPassword', this.key.insPassword)
      const config = {
        headers: {
          // 'Content-Type': 'multipart/form-data'
          "Content-Type": "application/x-www-form-urlencoded"
        }
      }
      const { data: res } = await this.$http.post('/api/user/Post_login', formData, config)
      this.Postlogin = res
      console.log(res);
      if (this.key.insAccount == this.Postlogin.sAccount || this.key.insPassword == this.Postlogin.sPassword) {
        this.$message.success('登录成功')
        this.$router.push('/users')
      } else {
        return this.$message.error('登录失败');
      }
      // 存储用户名
      Cookies.set('username', this.Postlogin.sName)
      // 存储id
      Cookies.set('nUid', this.Postlogin.nUid)
    }
  }
}
</script>
<style scoped lang="css" src="./assets/index.css" />
